const { url, publicPath } = require('./src/utils/env-setup')
// let url = (baseUrl.split('/'))[0]
const path = require('path')
const Timestamp = new Date().getTime()
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const version = 1.0 // 版本号
// console.log(process.env.NODE_ENV, 'process.env.NODE_ENV')
module.exports = {
  css: {
    loaderOptions: {
      less: {
        modifyVars: {
          '@primary-color': '#933dfe',
          '@link-color': '#933dfe',
          '@layout-header-background': '#933dfe',
          '@border-radius-base': '2px',
          '@menu-dark-submenu-bg': '#933dfe',
          '@highlight-color': '#933dfe'
        },
        javascriptEnabled: true
      }
    }
  },
  publicPath: publicPath,
  productionSourceMap: false,
  devServer: {
    // host: 'localhost',
    host: '0.0.0.0',
    port: 8080, 
    proxy: {
      '/': {
        target: url,
        changeOrigin: true,
        autoOpenBrowser: true,
        assetsSubDirectory: 'static',
        ws: false,
        pathRewrite: {
          // '^/api': '/api'
        },
      },
    },
  },
  configureWebpack: { // webpack 配置
    output: { // 输出重构  打包编译后的 文件名称  【模块名称.版本号.时间戳】
      filename: `js/[name].[hash].${version}.js?v=${Timestamp}`,
      chunkFilename: `js/[name].[hash].${version}.js?v=${Timestamp}`
    },
    plugins: [
      new MiniCssExtractPlugin({
        filename: `css/[name].${version}.css?v=${Timestamp}`,
        chunkFilename: `css/[name].${version}.css?v=${Timestamp}`
      })
    ]
  },
  chainWebpack: config => {
    const types = ['vue-modules', 'vue', 'normal-modules', 'normal']
    types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type)))
  },
  lintOnSave: false
};

function addStyleResource (rule) {
  rule.use('style-resource')
    .loader('style-resources-loader')
    .options({
      patterns: [
        path.resolve(__dirname, './src/assets/less/common.less'),
      ],
    })
}